<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		.content{
			width: 100%;
			height: 2800px;
			position: relative;
			display: flex;
		}
		.sticky-element {
		  width: 20%;
		  position: -webkit-sticky; /* 兼容性，针对一些旧版本浏览器需要添加此属性 */
		  position: sticky;
		  background-color: aqua;
		  height: 800px;
		  top: 20px;
		  right: 0px;
		}
		.content-element{
			width: 80%;
			height: 100%;
		}
		.footer{
			width: 100%;
			height: 400px;
			background-color: blue;
		}
	</style>
	<body>
		<div class="content">
		  <div class="content-element">
			
		  </div>
		  <div class="sticky-element">
		  		这是一个固定在顶部的元素。
		  </div>
		</div>
		<div class="footer">
		</div>
	</body>
</html>